<!DOCTYPE html>
<html lang="zh" xmlns:th="http://www.thymeleaf.org" >
<head>
    <th:block th:include="include :: header('设置模板')" />
    <th:block th:include="include :: ztree-css" />
</head>
<body class="white-bg">
    <div class="wrapper wrapper-content animated fadeInRight ibox-content">
        <form class="form-horizontal m" id="form-set-add" th:object="${baseAddress}">
            <input name="id" th:value="${infoTemplate.id}" type="hidden">
            <input name="infoId" th:value="${baseAddress.dzbm}" type="hidden">
            <div class="form-group">
                <label class="col-sm-3 control-label">地址名称：</label>
                <div class="col-sm-8">
                    <input name="dzmc" th:field="*{dzmc}" class="form-control" type="text">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">单位名称：</label>
                <div class="col-sm-8">
                    <input name="dwxx" th:field="*{dwxx}" class="form-control" type="text">
                </div>
            </div>
            <div class="form-group">
                <label class="col-sm-3 control-label">危险源点：</label>
                <div class="col-sm-8">
                    <input name="hazardId" th:value="${infoTemplate.hazardId}" type="hidden">
                    <input id="hazardName" th:value="${hazardNames}" class="form-control" type="text" readonly>
                    <div id="tree" class="ztree" style="border: 1px solid #e5e6e7"></div>
                </div>
            </div>

            <div class="form-group">
                <label class="col-sm-3 control-label">模板：</label>
                <div class="col-sm-8">
                    <select name="templateId" class="form-control">
                        <option th:each="template : ${templates}" th:text="${template.templateName}" th:value="${template.id}" th:field="${infoTemplate.templateId}"></option>
                    </select>
                </div>
            </div>
        </form>
    </div>
    <th:block th:include="include :: footer" />
    <th:block th:include="include :: ztree-js" />
    <script type="text/javascript">
        var prefix = ctx + "control/address";

        $(function() {
            var url = ctx + "control/hazard/treeData";
            var options = {
                id: "tree",
                url: url,
                check: { enable: true },
                expandLevel: 0,
                onCheck: onCheck
            };
            $.tree.init(options);
        });

        $("#form-set-add").validate({
            focusCleanup: true
        });

        function submitHandler() {
            if ($.validate.form()) {
                $.operate.save(prefix + "/addTemplate", $('#form-set-add').serialize());
            }
        }

        function onCheck() {
            $('input[name="hazardId"]').val(getChecked('id'));
            $('#hazardName').val(getChecked('name'));
        }

        function getChecked(column) {
            var nodes = $._tree.getCheckedNodes(true);
            return $.map(nodes, function (row) {
                if(!row.isParent){
                    return row[column]
                }
            }).join();
        }

    </script>
</body>
</html>
